<template>
  <el-dialog
  :visible="ismoreShow"
  @close="close"
  >
    <template #title>
      <el-row class="heard-btn">
        <i
        class="el-icon-circle-close closebtn"
        @click="close"
        ></i>
      </el-row>
    </template>
    <el-row class="more-title">
      <h1>我们的使命与方法</h1>
    </el-row>
    <el-row class="con-text">
      <h1>1. 支持人们做最好的自己</h1>
      <h3>以人力资源和技术为基础</h3>
      <p>· 运用管理学原理使人力资源开发和技术优势得到延伸</p>
      <p>· 通过人力资源和技术提高整个管理体系的协同效应</p>
    </el-row>
    <el-row class="con-text">
      <h1>2. 支持人们做最好的自己</h1>
      <h3>以人力资源和技术为基础</h3>
      <p>· 运用管理学原理使人力资源开发和技术优势得到延伸</p>
      <p>· 通过人力资源和技术提高整个管理体系的协同效应</p>
    </el-row>
    <el-row class="con-text">
      <h1>3. 支持人们做最好的自己</h1>
      <h3>以人力资源和技术为基础</h3>
      <p>· 运用管理学原理使人力资源开发和技术优势得到延伸</p>
      <p>· 通过人力资源和技术提高整个管理体系的协同效应</p>
    </el-row>
  </el-dialog>
</template>

<script>
export default {
  props: {
    ismoreShow: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    // 关闭弹窗
    close () {
      this.$emit('update:ismoreShow', false)
    }
  }
}
</script>

<style lang="scss" scoped>
/* 弹窗盒子 */
::v-deep .el-dialog {
  width: 65%;
  border-radius: 20px;
  /* 头部按钮 */
  .heard-btn{
    display: flex;
    justify-content: flex-end
  }
  /* 标题 */
  .more-title {
    color: black;
    font-size: 22px;
    margin-left: 40px;
    margin-bottom: 40px;
  }
  /* 主体文本 */
  .con-text{
    color:black;
    margin-bottom: 50px;
    margin-left: 140px;
     h3{
        margin: 15px 0;
    }

  }
  /* 关闭按钮 */
  .closebtn {
    font-size: 35px;
  }
}
/* 弹窗自带关闭按钮 */
::v-deep .el-dialog__headerbtn {
  display: none;
}
</style>
